﻿<html>
<head>
<title>the title</title>
   <script type="text/javascript" src="jquery-1.8.3.min.js"></script>
   <script type="text/javascript">
   $(document).ready(function() {
		token = "";
		school="";
		userId = "";
		studentId="";
		classUser="";
		type=""
		$("#driver").click(function(event){
			
			// get cfrs token using ajax
			
			
			$.ajax({
				dataType: "json",
				url: "http://truongnha.com/api/login/",
				
				type: "GET",
				success: function( data){
					var myJSONText = JSON.stringify(data, replacer);
					//alert( "OK: " + myJSONText);
					token=data.csrfmiddlewaretoken;
					//alert("OK");
					//******************
					$.ajax({// cau lenh ajax POST vs usernam password
						dataType: "json",
						url: "http://truongnha.com/api/login/",
						type: "POST",
						data: {username:"demo_hs",password:"123456",csrfmiddlewaretoken:token},
						success: function( data){
							var myJSONText = JSON.stringify(data, replacer);
							token2= JSON.stringify(data, replacer);
							//token2=data;
							
							school=data.user.school;
							studentId=data.user.studentId;
							type=data.user.type;
							userId=data.user.userId;
							classUser=data.user.class;
							
							alert( "OK: " + data.user.school);
						},
						error: function(xhr, textStatus, error){
							alert("Erorr");
						}
					});// end ajax
					//******************
				},
				error: function(xhr, textStatus, error){
					alert("Erorr2");
				}
			});// end ajax get
			
			
		});
    });
	function replacer(key, value) {
		if (typeof value === 'number' && !isFinite(value)) {
			return String(value);
		}
		return value;
	}
	function test()
	{
		alert("ffff");
	}
	
	// logout to server
	function logout()
	{
		$.ajax({
			url:"http://truongnha.com/api/logout",
			type:"GET",
			
			success: function(data)
			{
				alert("Logout success");
			},
			erorr: function()
			{
				alert("Erorr to logout");
			}
		});
	}
	
	function display()
	{
		alert( school + studentId + userId + type);
	}
	
	function getMark()
	{
		var urls= "http://truongnha.com/profile/"+studentId+"/";
		alert(urls);
		$.ajax({// cau lenh ajax POST vs usernam password
			dataType: "json",
			url: urls,
			type: "GET",
			success: function( data){
				alert("Success mark");
			},
			error: function(xhr, textStatus, error){
				alert("Erorr mark");
			}
		});// end ajax
	}
	
	
   </script>
</head>
<body>
   <p>Click on the button to load result.html file:</p>
   <div id="stage" style="background-color:blue;">
          STAGE
   </div>
   <input type="button" id="driver" value="Load Data" />
   <button onclick=test() > test</button>
   <button onclick=logout()>logout</button>
   <button onclick=display()>display Token</button>
   <button onclick=getMark()>get Mark for subject</button>
</body>
</html>